<template>
  <div class="page-search">
    <mt-search autofocus v-model="value" :result="filterResult"></mt-search>
  </div>
</template>
<script type="text/ecmascript-6">
  import Vue from 'vue';
  import Search from 'mint-ui/lib/search';
  import 'mint-ui/lib/search/style.css';

  Vue.component(Search.name,Search)

  export default {
        data() {
            return {
              value: '',
              defaultResult: [
                'Apple',
                'Banana',
                'Orange',
                'Durian',
                'Lemon',
                'Peach',
                'Cherry',
                'Berry',
                'Core',
                'Fig',
                'Haw',
                'Melon',
                'Plum',
                'Pear',
                'Peanut',
                'Other'
              ]
            }
        },
      computed: {
        filterResult() {
          return this.defaultResult.filter(value => new RegExp(this.value, 'i').test(value));
        }
      }
    }
</script>
